<template>
  <view class="wrap">
    <js-lang title="user.title"></js-lang>
    <view class="header">
      <view class="userinfo">
        <view class="image" @click="navTo('info')"></view>
        <view class="info">
          <view class="username">{{
            vuexUser.username || $t("login.noLogin")
          }}
          </view>
          <view class="usercode">{{
            vuexToken.client_id || $t("login.noLogin")
          }}
          </view>
        </view>
      </view>
      <view class="logout">
        <u-button type="success" shape="circle" size="mini" @click="logout">{{
          $t("login.logoutButton")
        }}
        </u-button>
      </view>
    </view>
    <view class="u-p-t-10 u-p-b-20">
      <view class="u-m-t-20">
        <u-cell-group>
          <u-cell-item icon="account" :iconSize="iconSize" :iconStyle="{ color: '#266bff' }" title="个人信息"
            @click="navTo('info')"></u-cell-item>
          <u-cell-item icon="lock" :iconSize="iconSize" :iconStyle="{ color: '#1bca6a' }" title="修改密码"
            @click="navTo('pwd')"></u-cell-item>
          <u-cell-item icon="question-circle" :iconSize="iconSize" :iconStyle="{ color: '#d99e59' }" title="在线客服"
            @click="chat()"></u-cell-item>
        </u-cell-group>
      </view>
    </view>
  </view>
</template>
<script>


export default {
  data() {
    return {
      iconSize: 38,
      image: undefined,
    };
  },
  methods: {
    navTo(url) {
      uni.navigateTo({
        url: url,
      });
    },
    logout() {
      this.$u.api.logout().then((res) => {
        this.$u.toast(res.message);

        //清空存储信息
        this.$u.vuex("vuexToken", "");
        this.$u.vuex("vuexUser", {});

        setTimeout(() => {
          uni.reLaunch({
            url: "/pages/sys/login/index",
          });
        }, 500);
      });
    },
    chat() {
      // #ifdef MP
      wx.openCustomerServiceChat({
        extInfo: {
          url: 'https://work.weixin.qq.com/kfid/kfc72b7650fd8e9f664'
        },
        corpId: 'wwdfd8cc3eb1127464',
        success(res) {
        },
        fail(res) {
        }
      })
      // #endif
    }
  },
};
</script>
<style lang="scss">
@import "index.scss";

page {
  background-color: #f8f8f8;
}
</style>
